<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>

    <title>Viewing</title>

    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <meta name="author" content="" />
    <meta name="description" content="" />
    <meta name="keywords" content="" />

	<link rel="stylesheet" href="css/main.css" />
	<link rel="Stylesheet" href="css/ui.selectmenu.css" type="text/css" />
	<link rel="Stylesheet" href="css/jquery.jscrollpane.css" type="text/css" />

    <link href="favicon.ico" rel="shortcut icon" />
	<link href="apple-icon.png" rel="apple-touch-icon" />

	<script type="text/javascript" src="js/jquery/jquery-1.4.2.min.js"></script>
	<script type="text/javascript" src="js/jquery-ui.min.js"></script>
	<script type="text/javascript" src="js/ui.selectmenu.js"></script>
	<script type="text/javascript" src="js/jquery.mousewheel.min.js"></script>
	<script type="text/javascript" src="js/jquery.jscrollpane.min.js"></script>
	<script type="text/javascript" src="js/scripts.js"></script>

</head>

<body>
<f:view>
<h:form>
	<div class="android-wrap">
	<div id="wrapper">
		<div id="header">
			<h1 class="title">SMS</h1>
			<ul class="app-controls">
                <li>
                    <h:commandLink value="Back" action="#{appBean.redeemBonus}" styleClass="appc-back"/>
                </li>
                <li>
                    <h:commandLink action="#{appBean.toLogin}" value="Logout" styleClass="appc-logout"/>
                </li>
            </ul>
        </div>
		<div id="content" class="expand">
			<div class="scroll-pane">
			<div class="sp-inner">
				<ul class="main-navi">
					<li>
						<a href="#"><span class="br"><span class="icon traf">10 Mb <small class="meta-i">(100 bonuses)</small></span></span></a>
					</li>
					<li>
						<a href="#"><span class="br"><span class="icon traf">20 Mb <small class="meta-i">(200 bonuses)</small></span></span></a>
					</li>
					<li>
						<a href="#"><span class="br"><span class="icon traf">50 Mb <small class="meta-i">(500 bonuses)</small></span></span></a>
					</li>
					<li class="disabled">
						<a href="#"><span class="br"><span class="icon traf">100 Mb <small class="meta-i">(1000 bonuses)</small></span></span></a>
					</li>
					<li class="disabled">
						<a href="#"><span class="br"><span class="icon traf">200 Mb <small class="meta-i">(1500 bonuses)</small></span></span></a>
					</li>
					<li class="disabled">
						<a href="#"><span class="br"><span class="icon traf">200 Mb <small class="meta-i">(1500 bonuses)</small></span></span></a>
					</li>
					<li class="disabled">
						<a href="#"><span class="br"><span class="icon traf">200 Mb <small class="meta-i">(1500 bonuses)</small></span></span></a>
					</li>
				</ul>
			</div>
			</div>
		</div>
	</div>
		<a href="#" class="android-control back-btn">Back</a>
	</div>
</h:form>
</f:view>
</body>
</html>